<template>
  <div class="friend-page">
    <van-icon  style="margin-left: -350px;margin-top: 10px" name="arrow-left" @click="goBack" />

    <van-card
        v-for="(friend, index) in friends"
        :key="friend.id || index"
    :title="friend.username"
    :desc="friend.useremail || '无邮箱信息'"
    :thumb="friend.userimg"
    >
    <template #footer>
      <div>
        <span>电话: {{ friend.userphone || '无电话信息' }}</span>
        <br />
        <span>性别: {{ getGender(friend.usersex) }}</span>
        <br />
        <span>邀请码: {{ friend.invitation || '无邀请码' }}</span>
      </div>
    </template>
    </van-card>
  </div>
</template>

<script>
import axios from "axios";

export default {
  data() {
    return {
      friends: [],
      id:"",
      userphone:"",
    };
  },
  created() {
    this.user=localStorage.getItem("user");
    let user=JSON.parse(this.user);
    console.log(user.id)
    this.id=user.id;
    // alert(this.userphone);
    this.fetchFriends();

  },
  methods: {
    goBack() {
      this.$router.go(-1); // 返回上一页
    },
    fetchFriends(){
      axios.post("http://localhost:9999/api-user/user/findFriend?id="+this.id).then(res => {
        // alert(JSON.stringify(res.data.data))
        if (res.data.data && res.data.data.length > 0) {
         this.friends = res.data.data;
        }else {
          this.$toast.fail("小老弟，没朋友");
        }
      }).catch(error => {
this.$toast.fail("请求失败，请刷新重试。")      });
    },
    // async fetchFriends() {
    //   try {
    //     const response = await fetch('http://localhost:9999/api-user/user/findFriend?userphone='+this.userphone, {
    //       method: 'POST'
    //     });
    //     const result = await response.json();
    //
    //     if (result.code === 1) {
    //       this.friends = result.data;
    //     } else {
    //       console.error('查询失败:', result.message);
    //     }
    //   } catch (error) {
    //     console.error('网络错误:', error);
    //   }
    // },
    getGender(sex) {
      if (sex === 1) return '男';
      if (sex === 2) return '女';
      return '未知';
    }
  }
};
</script>

<style scoped>
.friend-page {
  padding: 16px;
}
</style>
